<%@page import="com.mconnect.msurvey.model.Questions"%>
<%@page import="com.mconnect.msurvey.model.Category"%>
<%@page import="com.mconnect.msurvey.model.Responder"%>
<%@page import="com.mconnect.msurvey.model.Survey"%>
<%@page import="java.util.List"%>
<%@page import="com.mconnect.msurvey.model.User"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
     <%@ taglib prefix="s" uri="/struts-tags"%>
<% if(request.getParameter("pageNumber") == null){ %> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
	  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
	  <title>Panel Admina</title>
	  <link rel="stylesheet" href="resources/css/ap.css">
	  <link rel="stylesheet" href="js/jQuery/demos.css">
	  <link rel="stylesheet" href="js/jQuery/themes/base/jquery.ui.all.css">
	  <link rel="stylesheet" href="resources/css/detail_style.css">
	  
	  <script src="js/jQuery/jquery-1.8.2.js"></script>
		<script src="js/jQuery/ui/jquery.ui.core.js"></script>
	  <style>
		body { font-size: 62.5%; }
		label, input { display:block; }
		input.text { margin-bottom:12px; width:95%; padding: .4em; }
		fieldset { padding:0; border:0; margin-top:25px; }
		h1 { font-size: 1.2em; margin: .6em 0; }
		div#users-contain { width: 350px; margin: 20px 0; }
		div#users-contain table { margin: 1em 0; border-collapse: collapse; width: 100%; }
		div#users-contain table td, div#users-contain table th { border: 1px solid #eee; padding: .6em 10px; text-align: left; }
		.ui-dialog .ui-state-error { padding: .3em; }
		.validateTips { border: 1px solid transparent; padding: 0.3em; }
	</style>
	
  </head>

<body>
<div id="top">
   
     <div class="sessionUser">
    	<div id="logoMconnect">
    		<img src="resources/images/top_logo.gif" width="84" height="59" alt="image001"/>
    	</div>
    	<div id="mConnect_txt">
        	mConnect<br/>al. Jana Pawła II 41c<br/>31-864 Kraków
       </div>
    	
	     <% User admin = (User)session.getAttribute("admin"); 
			if(admin == null){ %>
				<jsp:forward page="loginAdminForm.jsp"></jsp:forward>
		<%}%>
    </div>
    <img src="resources/images/kreska.png" class="kreska">
    <div class="header_txt">
      <a href="adminPanel.jsp" style="text-decoration: none;">
     		<p class="header_txt_1">mSurvey</p>
      		<p class="header_txt_2">Panel Administratora</p>
      	</a>
    </div>
    <ul id=menu>
      
    <li><s:a action="goToSearchSurvey"> Wyszukaj ankietę </s:a></li>
	<li><s:a action="goToCampaigns">Kampanie</s:a></li>
	<li><s:a action="goToRegisterUser">Dodaj ankiet</s:a></li>
	<li><s:a action="goToConfirmList">Potwierdziły przybycie</s:a></li>
	<li><s:a action="goToReports">Raporty</s:a></li>
	<li style="float: right"><s:a action="logoutAdmin">Wyloguj</s:a></li>
    </ul>
   
    <div id=kategorie>
     <% } %>
     	<center>
	    <div id="users-contain" class="ui-widget" style="width: 700px; ">
	
				<h2>Wyniki wyszukiwania</h2>
				<script type="text/javascript">
					$(function() {
						var question1 = $( "#question1" ).val();
						var question2 = $( "#question2" ).val();
						var question3 = $( "#question3" ).val();
						var question4 = $( "#question4" ).val();
						var question5 = $( "#question5" ).val();
						var question6 = $( "#question6" ).val();
						
						var category1 = $( "#category1" ).val();
						var category2 = $( "#category2" ).val();
						var category3 = $( "#category3" ).val();
						var category4 = $( "#category4" ).val();
						var category5 = $( "#category5" ).val();
						var category6 = $( "#category6" ).val();
						
						var type =  $( "#type" ).val();
						var plan =  $( "#id_plan" ).val();
						
						
					$('#nextPage').click(function(){
						var startPage = parseFloat($( "#next" ).val());
						var page = startPage + 1;
							if(type == 'plan'){
								$.get(
										'searchSurveysPlan.action',
										{
											pageNumber: page,
											'questions.question1' : question1,
											'questions.question2': question2,
											'questions.question3' : question3,
											'questions.question4' : question4,
											'questions.question5' : question5,
											'questions.question6' : question6,
											'category.callCenter' : category1,
											'category.insurance' : category2,
											'category.it' : category3,
											'category.publicRelations' : category4,
											'category.sale' : category5,
											'category.telecommunication' : category6,
											id_plan : plan
										},
										function (content) {
											$('#users-contain').html(content);
											$( "#next" ).val(page);
											return false;
										}
									);
							}else{
								$.get(
										'searchSurveys.action',
										{
											pageNumber: page,
											'questions.question1' : question1,
											'questions.question2': question2,
											'questions.question3' : question3,
											'questions.question4' : question4,
											'questions.question5' : question5,
											'questions.question6' : question6,
											'category.callCenter' : category1,
											'category.insurance' : category2,
											'category.it' : category3,
											'category.publicRelations' : category4,
											'category.sale' : category5,
											'category.telecommunication' : category6
											
										},
										function (content) {
											$('#users-contain').html(content);
											$( "#next" ).val(page);
											return false;
										}
									);
							}
							
							
						});
					
					$('#previousPage').click(function(){
						var startPage = parseFloat($( "#next" ).val());	
						var page = startPage - 1;
						
						if(page >= 1){
							if(type == 'plan'){
								$.get(
										'searchSurveysPlan.action',
										{
											pageNumber: page,
											'questions.question1' : question1,
											'questions.question2': question2,
											'questions.question3' : question3,
											'questions.question4' : question4,
											'questions.question5' : question5,
											'questions.question6' : question6,
											'category.callCenter' : category1,
											'category.insurance' : category2,
											'category.it' : category3,
											'category.publicRelations' : category4,
											'category.sale' : category5,
											'category.telecommunication' : category6,
											id_plan : plan
										},
										function (content) {
											$('#users-contain').html(content);
											$( "#next" ).val(page);
											return false;
										}
									);
							}else{
								$.get(
										'searchSurveys.action',
										{
											pageNumber: page,
											'questions.question1' : question1,
											'questions.question2': question2,
											'questions.question3' : question3,
											'questions.question4' : question4,
											'questions.question5' : question5,
											'questions.question6' : question6,
											'category.callCenter' : category1,
											'category.insurance' : category2,
											'category.it' : category3,
											'category.publicRelations' : category4,
											'category.sale' : category5,
											'category.telecommunication' : category6
										},
										function (content) {
											$('#users-contain').html(content);
											$( "#next" ).val(page);
											return false;
										}
									);
							}
						}
					});
						
					});
				</script>
				
				<% 	List<Survey> list = (List<Survey>)request.getAttribute("surveyList");
					Questions question = (Questions)request.getAttribute("questions");
					Category category = (Category)request.getAttribute("category");
					String typeOfSearch = (String)request.getAttribute("typeOfSearch");
					int id_plan = (Integer)request.getAttribute("id_plan");
					if(list.isEmpty() && request.getParameter("pageNumber") == null ){ %>
						<div class="ui-widget" style="width: 80%; margin-left: 10%; margin-top: 20px;">
							<div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
								<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
								<strong>Nie znaleziono osób spełniających twoje kryteria.</strong> <br /><br /> Zmień kryteria wyszukiawń</p>
							</div>
						</div>
					<%}else{
						
						if(question != null && category != null){
    			%>
			    			<jsp:include page="inputs/questions.jsp">
    							<jsp:param value="<%=question %>" name="questions"/>
    						</jsp:include>
			    			
			    			<jsp:include page="inputs/category.jsp">
    							<jsp:param value="<%=category %>" name="category"/>
    						</jsp:include>
    				<%}else if(question != null && category == null){ %>
    						<jsp:include page="inputs/questions.jsp">
    							<jsp:param value="<%=question %>" name="questions"/>
    						</jsp:include>
    				<%}else if(question == null && category != null){ %>
    						<jsp:include page="inputs/category.jsp">
    							<jsp:param value="<%=category %>" name="category"/>
    						</jsp:include>
    				<%} %>
    				<input type="hidden" value="<%=typeOfSearch %>" id="type">
    				<input type="hidden" value="<%=id_plan %>" id="id_plan">
				<table id="users" class="ui-widget ui-widget-content" style="width: 700px; ">
				<thead>
				<tr class="ui-widget-header ">
					<th>Imie</th>
					<th>Nazwisko</th>
					<th>Telefon</th>
					<th>Szczegóły</th>
				</tr>
				<tbody>
					<s:iterator value="surveyList" >
						<tr>
							<td ><s:property value="id_responder.firstname"/>
							<td><s:property value="id_responder.lastname"/></td>
							<td ><s:property value="id_responder.phone"/></td>
							<td ><a href="surveyDetails.jsp?id=<s:property value="id_survey"/>&date=<s:property value="date_survey"/>&id_responder=<s:property value="id_responder.id_responder"/>">szczegóły</a></td>
						</tr>	
					</s:iterator>
					<tr>
						<td colspan="4" id="form">
							<div>
								
									<div style="float: left; margin-top: 3px;"><a href="#" id="previousPage" style="display: block;"><img alt="Previous" src="resources/images/previous.png"> </a></div>
									<div style="float: left; margin-left: 5px;"><input type="text" id="next" style="width: 20px;"  value="1" ></div>
									<div style="float: left; margin-left: 5px; margin-top: 3px;"><a href="#" id="nextPage" style="display: block;"><img alt="Next" src="resources/images/next.png"> </a> </div>
								
								
							</div>
						 </td>
					</tr>
				</tbody>	
				</table>
				
				
		</div>
		</center>
		<% } %>
		
		<% if(request.getParameter("pageNumber") == null){ %> 
		<center>
			<div style="width:100%; float: left;">
				<div class="d_aBackSearch" style=" margin-bottom: 10px; margin-left: 35%; width: 250px;"  >
					<div class="a"><a href="javascript:history.back()" style="text-decoration: none; display: block; text-align: center; color: white; font-weight: bold;">Zmień kryteria wyszukiwania</a></div>
				</div>
			</div>
		</center>
    </div>
		 
</div>   	
<%} %>
  </body>
</html>